<template>
  <div class="page-container-padding">
    <div class="container">
      <div style="margin: 0px auto; width:360px; color: #1890ff; font-size: 24px; font-weight: 700;text-align: center;">
        欢迎使用研究院协同服务系统
      </div>
      <div style="text-align: center;margin: 20px;font-size: 12px;">现在是</div>
      <div style="text-align: center;color: #ea5504;font-weight: 700;font-size: 18px;">{{ showDatetime }}</div>
    </div>
  </div>
</template>

<script>
  export default {
    data(){
      return {
        showDatetime: '',
        timer: null
      }
    },
    created() {
      this.getShowDatetime()
    },
    mounted() {
      this.timer = setInterval(this.getShowDatetime, 1000)
    },
    destroyed() {
      clearInterval(this.timer)
    },
    methods:{
      getShowDatetime(){
        const date = new Date()
        let week;
        switch (date.getDay()){
           case 1: week="星期一"; break;
           case 2: week="星期二"; break;
           case 3: week="星期三"; break;
           case 4: week="星期四"; break;
           case 5: week="星期五"; break;
           case 6: week="星期六"; break;
           default: week="星期天";
        }
        let year = date.getFullYear()
        let month = this.addZero(date.getMonth()+1);
        let days = this.addZero(date.getDate());
        let hours = this.addZero(date.getHours());
        let minutes = this.addZero(date.getMinutes());
        let seconds=this.addZero(date.getSeconds());
        let ndate = year+"年"+month+"月"+days+"日"+" "+week+ " "+hours+":"+minutes+":"+seconds;
        this.showDatetime = ndate
      },

      addZero(t){
        return t<10?'0'+ t :t
      }
    }
  }
</script>

<style scoped>
  .container{
    height: 150px;
    padding-top: calc(40vh - 75px);
  }

</style>
